<template>
    <div class="real_time_event">
        <div class="real_time_event_content">
            <p class="real_time_title">实时事件  <span class="close" @click="closeModal(2)"></span></p>
            <ul class="real_time_item">
                <li><span>事件名称</span><span>概率</span></li>
                <li v-for="(item,index) in realTimeEvent" :style="{background: index % 2 === 0 ? '#4c4b50': '#2d2e32'}">
                    <span><a>{{item.name}}</a></span>
                    <span><span class="percent"><span :style="{width: item.status+'%'}"><span>{{item.status}}%</span></span></span></span>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        name: "real-time-event",
        components: {},
        props: ['realTimeEvent', 'closeModal'],
        data() {
            return {}
        },
        mounted() {

        },
        methods: {
            toDetail() {
                window.open(window.location.href + 'detail_message');
            }
        }
    }
</script>

<style lang="less" type="text/less" scoped>
    @import "realTimeEvent";
</style>